<template>
   <div class="search">
      <div class="search-input-box">
        <input type="text" placeholder="请输入要搜索的关键词" v-model="keywords">
      </div>
      <div class="search-btn" @click="search">确定</div>
  </div>
</template>

<script>
import { getActivityList } from '../../api/index.js'
export default {
  data(){
    return{
      keywords: '',
    }
  },
  mounted(){
    this.keywords = '';
  },
  methods: {
    async search(){
      if(this.keywords == ""){
          wx.showToast({
            title: '请输入内容',
            icon: 'none',
            duration: 2000
          })
        }else{
        var userToken = wx.getStorageSync('userToken');
        let params = {
          user_token: userToken,
          keywords: this.keywords,
        };
        let res = await getActivityList(params);
        if(res.data.level == "success"){
          let keywordsActivityList = res.data.activities;
          if(keywordsActivityList.length == 0){
            wx.showToast({
              title: '请输入活动标题相关内容',
              icon: 'none',
              duration: 2000
            })
          }else{
            wx.reLaunch({
              url: "/pages/home/main?keywords=" + this.keywords,
            })
          }
        }
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
  .search
    width 100%
    display flex
    justify-content center
    align-items center
    padding 40rpx
    font-size 14px
    .search-input-box
      background-color #f1f1f1
      height 70rpx
      flex 4
      display flex
      justify-content center
      align-items center
      padding-left 80rpx
      border-radius 10rpx
      background-image url(../../../static/images/search.png)
      background-size 60rpx 60rpx
      background-repeat no-repeat
      background-position 10rpx center
      input
        width 100%
    .search-btn
      flex 1
      text-align center
      line-height 68rpx
      height 68rpx
      background-color #606266
      color #fff
      border-radius 10rpx
      margin-left 20rpx
</style>